import {Component, OnDestroy, OnInit} from '@angular/core';
import {FormControl, FormGroup, Validators} from "@angular/forms";
import {BarnTeamService} from "../service/barn-team.service";
import {NzMessageService} from "ng-zorro-antd/message";
import {ActivatedRoute} from "@angular/router";
import {BarnRole} from "../../role/entity/barn-role";
import {Subscription} from "rxjs";
import {NzModalService} from "ng-zorro-antd/modal";
import {RoleInfoService} from "../../role/service/role-info.service";
import {TeamRoleService} from "../../services/team-role.service";
import {RoleSelectionComponent} from "../../role/role-selection/role-selection.component";

@Component({
  selector: 'app-team-edit',
  templateUrl: './team-edit.component.html',
  styleUrls: ['./team-edit.component.less']
})
export class TeamEditComponent implements OnInit, OnDestroy {

  remarkMaxLength = 1000
  validateForm = new FormGroup({
    teamName: new FormControl(null, [Validators.required, Validators.maxLength(20)]),
    remark: new FormControl(null, [Validators.maxLength(this.remarkMaxLength)]),
    pid: new FormControl(null),
    enable: new FormControl("1", [Validators.maxLength(20)])
  })

  loading = false

  roles: BarnRole[] = []

  modalHook$: Subscription

  constructor(private teamService: BarnTeamService, private msg: NzMessageService, private routeInfo: ActivatedRoute,
              private modal: NzModalService, private roleService: RoleInfoService, private teamRoleService: TeamRoleService) {
  }

  ngOnInit(): void {
    const pid = this.routeInfo.snapshot.queryParams["pid"];
    if (pid) {
      this.loading = true
      this.teamService.getById(pid).subscribe(value => {
        if (value) {
          this.validateForm.patchValue(value);
          this.getRoles(pid)
        }
      }, () => this.loading = false, () => this.loading = false)
    }
  }


  ngOnDestroy(): void {
    if (this.modalHook$) {
      this.modalHook$.unsubscribe()
    }
  }

  get pid() {
    return this.validateForm.get("pid").value
  }

  submitForm() {

    if (this.validateForm.valid) {
      const team = this.validateForm.getRawValue();
      this.loading = true
      this.teamService.save(team).subscribe(value => {
        this.validateForm.patchValue(value)
        this.loading = false
        this.msg.success("保存成功")
      }, error => this.loading = false);
    } else {
      for (const i in this.validateForm.controls) {
        this.validateForm.controls[i].markAsDirty();
        this.validateForm.controls[i].updateValueAndValidity();
      }
    }

  }

  deleteRole(roleId) {
    const pid = this.validateForm.get("pid").value;
    this.loading = true
    this.teamRoleService.delete(roleId, pid)
      .subscribe(value => {
        this.getRoles(pid)
        this.loading = false
        this.msg.success("删除成功")
      }, () => this.loading = false)
  }

  addRoleDialog() {
    const modalHook = this.modal.create({
      nzTitle: '添加角色',
      nzContent: RoleSelectionComponent,
      nzFooter: null,
      nzWidth: 1000,
      nzComponentParams: {
        height: 600, multi: true
      }
    })
    if (this.modalHook$) {
      this.modalHook$.unsubscribe()
    }
    this.modalHook$ = modalHook.afterClose.asObservable().subscribe(value => {
      if (value && value.length) {
        this.addRoles(value);
      }
    });
  }

  addRoles(roleIds: string[]) {
    if (!roleIds) {
      return
    }

    const pid = this.validateForm.get("pid").value;
    this.loading = true
    this.teamRoleService.addRoleIds(pid, roleIds)
      .subscribe(value => {
        this.msg.success("添加成功");
        this.loading = false
        this.getRoles(pid)
      }, () => this.loading = false)
  }

  getRoles(teamId: string) {
    this.loading = true
    this.roleService.getByTeamId(teamId)
      .subscribe(value => {
        this.loading = false
        this.roles = value || []
      }, () => this.loading = false);
  }


}
